<?php
    $favorite = model('fav');
    // 检查用户是否收藏过该帖子
    $favorited = $favorite->checkIfFavorited(segment(3, 'int'));
?>

<?php if (session('user_id')) : ?>
    <?php if ($favorited): ?>
        <!-- 取消收藏 -->
        <a href="javascript:;" class="post-action-fav favorited js-fav" data-pid="<?= $post->id ?>" data-bs-toggle="tooltip" data-bs-trigger="hover" title="取消收藏">
            <div class="d-flex justify-content-center post-action-icon">
                <i class="iconfont icon-fav-fill"></i>
            </div>
    <?php else: ?>
        <!-- 点击收藏 -->
        <a href="javascript:;" class="post-action-fav js-fav" data-pid="<?= $post->id ?>" data-bs-toggle="tooltip" data-bs-trigger="hover" title="收藏">
            <div class="d-flex justify-content-center post-action-icon">
                <i class="iconfont icon-fav"></i>
            </div>
    <?php endif ?>
<?php else: ?>
    <!-- 提醒登录 -->
    <a href="javascript:;" class="post-action-fav js-jump" data-bs-toggle="tooltip" data-bs-trigger="hover" title="收藏">
        <div class="d-flex justify-content-center post-action-icon">
            <i class="iconfont icon-fav"></i>
        </div>
<?php endif ?>
        <span id="js-favNum<?= $post->id ?>"><?= $post->favorites ?></span>
    </a>

<script>
document.addEventListener("DOMContentLoaded", function() {
    // 收藏
    var jFav = document.querySelector('.js-fav');

    if (jFav) {
        jFav.addEventListener('click', function () {
            let pid = jFav.getAttribute("data-pid");
            var favNumSelector = `#js-favNum${pid}`;
            var favNumElement = document.querySelector(favNumSelector);
            var num = parseInt(favNumElement.textContent);
            let act = jFav.classList.contains("favorited");
            let favNum = '#js-favNum' + pid;
            var postActionFavElement = document.querySelector('.post-action-fav');
            var iconFavFillElement = document.querySelector('.icon-fav-fill');
            var iconFavElement = document.querySelector('.icon-fav');

            fetch(`/fav/add/${pid}`)
                .then((response) => response.json())
                .then((res) => {
                    if (res.status === 'success') {
                        if (act === true) {
                            num--;
                            postActionFavElement.setAttribute('data-bs-original-title', '收藏');
                            iconFavFillElement.classList.remove('icon-fav-fill');
                            iconFavFillElement.classList.add('icon-fav');
                        } else {
                            num++;
                            postActionFavElement.setAttribute('data-bs-original-title', '取消收藏');
                            iconFavElement.classList.remove('icon-fav');
                            iconFavElement.classList.add('icon-fav-fill');
                        }

                        jFav.classList.toggle('favorited');
                        favNumElement.textContent = num;
                    } else {
                        toast.error(res.message);
                    }
                });
        });
    }
});
</script>